<template>
  <div class="hy-dialog">
    <el-dialog v-model="dialogVisible" :title="title" width="30%">
      <slot name="content"></slot>
      <template #footer>
        <slot name="footer">
          <span class="dialog-footer">
            <el-button @click="dialogVisible = false">取消</el-button>
            <el-button type="primary" @click="handleConfirmClick">
              确定
            </el-button>
          </span>
        </slot>
      </template>
    </el-dialog>
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue';
const emits = defineEmits(['handleConfirmClick']);
const props = withDefaults(
  defineProps<{
    title?: string;
  }>(),
  {
    title: '提示'
  }
);
const dialogVisible = ref(false);

const handleConfirmClick = () => {
  emits('handleConfirmClick');
  dialogVisible.value = false;
};
defineExpose({
  dialogVisible
});
</script>

<style scoped></style>
